<template>
	<view class="content">
		<view class="taitoulist" v-if="ins == 1">
				<view class="nameBox">
					<view class="nameLeft">
						<text class="name">姓名</text>
						<text class="wyyname">
							ئىسىم
						</text>
					</view>
					<view class="nameRight">
						<input class="inputname" type="text" placeholder="请输入姓名" />
					    <text class="wyyname wyy">
							ئىسىم - فامىلىڭىزنى كىرگۈزۈڭ
					    </text>
					</view>
				</view>
				<view class="nameBox">
					<view class="nameLeft">
						<text class="name">联系电话</text>
						<text class="wyyname">
							ئالاقىلىشىش تېلېفون نومۇرى
						</text>
					</view>
					<view class="nameRight">
						<input class="inputname" type="text" placeholder="请输入电话" />
					    <text class="wyyname wyy">
							تېلېفون كىرگۈزۈڭ
					    </text>
					</view>
				</view>
				<view class="nameBox">
					<view class="nameLeft">
						<text class="name">身份证号码</text>
						<text class="wyyname">
							كىملىك نومۇرى
						</text>
					</view>
					<view class="nameRight">
						<input class="inputname" type="text" placeholder="请输入身份证号码" />
					    <text class="wyyname wyy">
							كىملىك نومۇرىنى كىرگۈزۈڭ
					    </text>
					</view>
				</view>
				<view class="nameBox">
					<view class="nameLeft">
						<text class="name">车牌号</text>
						<text class="wyyname">
							ماشىنا نومۇر تاختىسى
						</text>
					</view>
					<view class="nameRight">
						<input class="inputname" type="text" placeholder="请输入车牌号" />
					    <text class="wyyname wyy">
							ئاپتوموبىل نومۇر تاختىسى كىرگۈزۈڭ
				        </text>
					</view>
				</view>
				<view class="nameBox">
					<view class="nameLeft">
						<text class="name">绑定操作员</text>
						<text class="wyyname">
							باغلاش مەشغۇلاتچى
						</text>
					</view>
					<view class="nameRight">
						<input class="inputname" type="text" placeholder="请选择操作元员" />
					    <text class="wyyname wyy">
							مەشغۇلات خادىمىنى تاللاڭ.
					    </text>
					</view>
				</view>
		</view>
		
		<view class="tianjiaBox">
			<text class="tianjia">提交</text>
			<text class="wyytianjia">
				تاپشۇرۇش
			</text>
		</view>		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				ins:1
			}
		},
		methods: {
			changeins(v){
				if(this.ins != v){
					this.ins = v
				}
			}
		}
	}
</script>

<style scoped>
.content{
	min-height: 100vh;
	background-color: #f5f5f5;
	padding-bottom: 80rpx;
}
.typeBox{
	padding: 42rpx 30rpx 30rpx 30rpx;
    display: flex;
	align-items: center;
	justify-content: space-between;
	color: #333333;
	background-color: #FFFFFF;
}
.gerenBox,.danweiBox{
	display: flex;
}
.right{
	padding-left: 18rpx;
}
.name{
	font-size: 30rpx;
	line-height: 30rpx;
}
.wyyname{
	font-size: 24rpx;
	padding-top: 18rpx;
}
.dian{
	width: 30rpx;
	height: 30rpx;
	border-radius: 50%;
	border: 1rpx #BFBFBF solid;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .1s ease-in-out;
}
.dian text{
	width: 16rpx;
	height: 16rpx;
	border-radius: 50%;
	background-color: transparent;
}
.active{
	transition: all .2s ease-in-out;
	border: 1rpx #FFC03C solid;
}
.active text{
	background-color: #FFC03C;
}

.tianjiaBox{
		width: 100vw;
		background-color: #FFC03C;
		height: 100rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		color: #FFFFFF;
		font-size: 30rpx;
		line-height: 32rpx;
		position: fixed;
		bottom: 0;
	}
	.wyytianjia{
		font-size: 24rpx;
	}
	.gerenlist,.taitoulist{
		padding: 0 30rpx;
		background-color: #FFFFFF;
	}
	.nameBox{
		border-top: 1rpx #eee solid;
		padding: 35rpx 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 24rpx;
		color: #333333;
	}
	.nameLeft{
		display: flex;
		flex-direction: column;
	}
	.nameRight{
		display: flex;
		flex-direction: column;
		align-items: flex-end;
	}
	.inputname{
		font-size: 30rpx;
		text-align: right;
	}
	.wyy{
		color: #999999;
	}
</style>
